<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>e店邦</title>
    <link rel="stylesheet" href="/frontend/css/bootstrap.min.css">
    <link rel="stylesheet" href="/frontend/css/bootstrap-datetimepicker.min.css">
    <link rel="stylesheet" href="/frontend/css/bootstrapValidator.min.css">
    <link rel="stylesheet" href="/frontend/css/reset.css">
    <link rel="stylesheet" href="/frontend/css/common.css">
    <link rel="stylesheet" href="/frontend/css/maintenance.css">
</head>
<body>
<!--头部菜单-->
<div class="header"></div>

<!--主体内容-->
<div class="main-container">
    <div class="main-content">
        <p class="title"><i></i>养修预约</p>
        <form id="maintenanceForm" id="form-appointment-add">

            <div class="form-list">
                <div class="form-group form-list-item form-list-item1">
                    <label class="form-title" >姓名</label>
                    <input type="text" class="form-control form-control-phone" id="customerName" placeholder="请输入姓名" name="customerName">
                </div>
            </div>

            <div class="form-list">
                <div class="form-group form-list-item form-list-item1">
                    <label class="form-title" for="phoneNumber">手机号码</label>
                    <input type="text" class="form-control form-control-phone" id="customerPhone" placeholder="请输入手机号码" name="customerPhone">
                    <p class="send-btn">发送验证码</p>
                </div>
                <div class="form-group form-list-item">
                <label class="form-title" for="verificationCode">验证码</label>
                <input type="text" class="form-control" id="verificationCode" placeholder="请输入验证码" name="verification">
            </div>
            </div>

            <div class="form-list">
                <div class="form-group form-list-item form-list-item1">
                    <label class="form-title" >车牌</label>
                    <input type="text" class="form-control form-control-phone" id="licensePlate" placeholder="请输入车牌" name="licensePlate">
                </div>
            </div>


            <div class="form-list">
                <div class="form-group form-list-item form-list-item1">
                    <label class="form-title" for="appointmentTime">预约时间</label>
                    <input class="form-control" id="appointmentTime" placeholder="请选择预约时间" readonly name="appointmentTime">
                </div>
                <div class="form-group form-list-item">
                    <label class="form-title">服务类型</label>
                    <label class="radio-inline">
                        <input type="radio" name="serviceType" value="0" checked> 维修
                    </label>
                    <label class="radio-inline">
                        <input type="radio" name="serviceType" value="1"> 保养
                    </label>
                </div>
            </div>
            <div class="form-list">
                <div class="form-group form-list-item" style="align-items: baseline;">
                    <label class="form-title" for="problemDescription">问题描述</label>
                    <textarea class="form-control" rows="5" id="problemDescription" name="info"></textarea>
                </div>
            </div>
            <div class="form-list">
                <div class="form-list-item" style="padding-left: 120px;">
                    <div class="form-group radio">
                        <label>
                            <input type="checkbox" checked name="agree[]" id="check"/>
                            我已阅读并同意<a>《隐私政策》</a>
                        </label>
                    </div>
                </div>
            </div>
            <div class="form-group">
                <button type="button" class="btn btn-primary btn-lg btn-block" onclick="submitHandler()" id="submitBtn">提交</button>
            </div>
            </form>
        </form>
    </div>
</div>

<!--底部内容-->
<div class="footer"></div>

<script src="/frontend/js/jquery-3.6.0.min.js"></script>
<script src="/frontend/js/bootstrap.min.js"></script>
<script src="/frontend/js/bootstrap-datetimepicker.min.js"></script>
<script src="/frontend/js/bootstrap-datetimepicker.zh-CN.js"></script>
<script src="/frontend/js/bootstrapValidator.min.js"></script>
<script src="/frontend/js/layer/layer.js"></script>
<script src="/frontend/js/maintenance.js"></script>

<script>


    function submitHandler() {
            if ($.validate.form()) {
                $.operate.save("http://localhost/business/appointment/save", $('#form-appointment-add').serialize());

    }}



</script>




</body>
</html>
